<div class="c-person">

	{%
		set avatar = {
			cssClass: "c-person__photo",
			image: person.photo,
			link: person.website,
			name: person.name
		}
	%}
	{% include "avatar.njk" %}

	<div class="c-person__info">
	{% if personRole == "author" %}
		<h2 id="{{ person.name | slugify }}" class="u-font-size-body-large c-person__name">
			{{ person.name }}
		</h2>
		{% if person.website %}
			<p>
				<a class="u-font-size-body u-text-transform-uppercase c-person__link c-person__link--primary" href="{{ person.website }}">
					{% if person.first %}
						{{ person.first }}'s website
					{% else %}
						{{ person.name }}'s website
					{% endif %}
				</a>
			</p>
		{% endif %}
		{% if person.biography %}
			<p class="c-person__biography">
				{{ person.biography }}
			</p>
		{% endif %}
		{% set author_posts = collections.posts | getPostsByAuthor(person.name) %}
		<ul>
			{% for post in author_posts %}
				<li><a class="c-person__link" href="{{post.url}}">{{ post.data.title | safe }}</a></li>
			{% endfor %}
		</ul>
	{% endif %}
	{% if personRole == "staff" %}
		<h3 id="{{ person.name | slugify }}" class="u-font-size-body-large c-person__name">
			{{ person.name }}
		</h3>
		{% if person.website %}
			<p>
				<a class="u-font-size-body u-text-transform-uppercase c-person__link" href="{{ person.website }}">
					{% if person.first %}
						{{ person.first }}'s website
					{% else %}
						{{ person.name }}'s website
					{% endif %}
				</a>
			</p>
		{% endif %}
		{% if person.biography %}
			<p class="c-person__biography">
				{{ person.biography }}
			</p>
		{% endif %}
	{% endif %}
	{% if personRole == "spotlight" %}
		<h2 id="{{ person.name | slugify }}" class="u-font-size-body-large c-person__name">
			{{ person.name }}
		</h2>
		{% if person.biography %}
			<p class="c-person__biography">
				{{ person.biography }}
			</p>
		{% endif %}
		{% set author_posts = collections.posts | getPostsByAuthor(person.name) %}
		<ul>
			{% for post in author_posts %}
				<li><a class="c-person__link" href="{{post.url}}">{{ post.data.title | safe }}</a></li>
			{% endfor %}
		</ul>
		{% if person.first %}
			<p>
				<a class="c-person__spotlight-link" href="{{ person.website }}">Learn more about {{ person.first }}</a>
			</p>
		{% endif %}
	{% endif %}
	</div>
</div>
